<!doctype html>
<html lang="en">
  <head>
    <meta charset="UTF-8" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
    <link rel="icon" href="https://fav.farm/🛰️" />
    <link rel="stylesheet" href="./style.css" />
    <title>Kitchen sink • Remote DOM</title>
  </head>
  <body>
    <main></main>

    <!--
      We use an iframe as the remote environment here, because it supports
      modules in most modern browsers. Aside from support for ES modules, there
      is nothing that prevents us from instead using a web worker as the remote
      environment. Note that, without using a separate domain, or manually
      hiding globals within the iframe, we are not actually creating a “safe”
      sandbox here, as the remote code can reach up into the parent.
    -->
    <iframe
      src="./remote/iframe/"
      style="visibility: hidden; position: absolute"
    ></iframe>

    <!--
      This JavaScript will connect to the iframe, and begin propagating UI updates
      into the UI element above.
    -->
    <script type="module" src="./host.tsx" crossorigin="anonymous"></script>
  </body>
</html>
